/**
* 弹窗组件，使用： this.$store.dispatch('setModal', {visible: true, modalId: 'gamePwdInputModal',gameId:'',createUser:''}); 注意this指向的上下文环境，有时候是写self或其它
*/
<template>
  <transition name="slide-fade">
    <div v-if="modal.visible && modal.modalId=='gamePwdInputModal'" class="modal" id="gamePwdInputModal" tabindex="-1" @click.stop.prevent="modalHide">
      <div class="modal-dialog" @click.stop.prevent>
        <div class="modal-content">
          <img src="~assets/images/tankuang-m@2x.png" class="img-responsive">
          <img src="~assets/images/close@2x.png" data-dismiss="modal" class="img-close" @click.stop.prevent="modalHide">
          <div class="oxhead">
            <img src="http://dl.app.gtja.com/nrng/shareimages/oxhead/niudengpao.png">
          </div>
          <div class="wrapper">
            <h4>啊哦，大王想进入该比赛，需要先<span>输入参赛口令</span>哦~</h4>
            <div class="form-group">
              <input type="text" class="form-control input-lg" v-model="gamePWD" id="gamePWD" name="gamePWD" placeholder="请输入参赛口令" value="">
              <p class="help-block"></p>
            </div>
            <button type="button" class="btn btn-agree btn-lg" @click="gameSignUp">填好了</button>
            <button type="button" class="btn btn-reject btn-lg" data-dismiss="modal" @click.stop.prevent="modalHide">算了</button>
          </div>
        </div>
      </div>
    </div>
  </transition>
</template>

<script>
  import BaseModal from 'components/modal/BaseModal'
  import RemoteDAO from 'common/remoteDAO'
  import LocalDAO from 'common/localDAO'

  export default {
    data () {
      return {
        gamePWD:''
      }
    },
    extends:BaseModal,
    methods:{
      gameSignUp(){
        var self = this;
        var userCode = LocalDAO.getUserCode();
        RemoteDAO.callUC12008304(userCode, self.modal.gameId, self.gamePWD, self.modal.createUser, function (response) {
          if (Number(response.error) === 0) {
            self.modalHide();
            self.$store.dispatch('setModal', {visible: true, modalId: 'gameRegisterSuccModal'});
            self.$emit('success')
          } else {
            self.$store.dispatch('setTip',{text:response.data});
          }
          // 埋点
          var object = {};
          object.usercode = userCode;
          TDAPP.onEvent("12002", "", object);
          TDAPP.send();
        });
      }
    }
  }
</script>

<style scoped>
  .slide-fade-enter-active,.slide-fade-leave-active{
    transition: all 0.3s ease;
  }
  .slide-fade-enter, .slide-fade-leave-active {
    transform: translate(0,-25%);
    opacity: 0;
  }
</style>
